<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Avatar Maker</title>


    <!-- Manifest.json  -->
    <meta property="og:title" content="Avatar Maker">
    <meta property="og:description" content="Make Simple and Slick profile pic !">
    <meta property="og:image" content="../assets/Images/avatarMaker/icon.png">
    <meta property="og:url" content="name.com">

    <!-- Main Link Tags  -->
    <link href="../assets/Images/avatarMaker/icon.png" rel="icon" type="image/png" sizes="16x16">
    <link href="../assets/Images/avatarMaker/icon.png" rel="icon" type="image/png" sizes="32x32">

    <!-- fonts and css -->
    <link rel="preconnect" href="https://fonts.gstatic.com">
    <link href="https://fonts.googleapis.com/css2?family=Nunito&family=Raleway&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="../assets/css/avatarMaker_css/avatarMaker.min.css">
</head>

<body>
    <h2>Avatar Maker</h2>


    <div class="top">
        <svg width="659" height="742" viewBox="0 0 659 742" fill="none" xmlns="http://www.w3.org/2000/svg">
            <path
                d="M668.815 738.146C1089.7 800.717 1427.44 -32.6074 1076 -272.5C791.232 -466.882 463.75 -258.767 236.358 0.40514C183.928 60.1622 37.3452 81.6333 121.068 168.175C204.791 254.717 -67.5585 376.718 16.4657 488.254C90.9126 587.077 247.719 534.039 370.951 598.534C431.47 630.207 450.651 663.182 513.955 691.524C570.01 716.621 606.344 728.858 668.815 738.146Z"
                fill="url(#paint0_linear)" />
            <defs>
                <linearGradient id="paint0_linear" x1="93.9025" y1="463.868" x2="663.803" y2="-35.6472"
                    gradientUnits="userSpaceOnUse">
                    <stop stop-color="#022249" />
                    <stop offset="1" stop-color="#022249" stop-opacity="0.9" />
                </linearGradient>
            </defs>
        </svg>

    </div>
    <div class="bottom">
        <svg id="bec1841e-d5f7-4ebd-90a9-3aec712650c0" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg"
            width="300" height="300" viewBox="0 0 878.6662 681">
            <polygon points="436.155 671.623 426.8 671.623 422.349 635.538 436.156 635.539 436.155 671.623"
                fill="#ffb8b8" />
            <path
                d="M599.20737,789.34575l-30.16489-.00111v-.38154a11.74076,11.74076,0,0,1,11.74109-11.7409h.00074l18.42362.00074Z"
                transform="translate(-160.6669 -108.65425)" fill="#2f2e41" />
            <polygon points="540.662 662.87 531.844 665.993 515.602 633.465 528.617 628.856 540.662 662.87"
                fill="#ffb8b8" />
            <path
                d="M706.60585,779.27588,678.1714,789.34575l-.12738-.35964a11.74077,11.74077,0,0,1,7.14755-14.98714l.00071-.00025,17.36674-6.15026Z"
                transform="translate(-160.6669 -108.65425)" fill="#2f2e41" />
            <path
                d="M596.56111,768.16153a3.52031,3.52031,0,0,1-.626-.05663l-11.44-2.07984a3.44993,3.44993,0,0,1-2.82149-3.3094c-1.6629-77.00535,6.51262-128.7531,24.29909-165.84438a3.41355,3.41355,0,0,1,3.57954-1.89354l41.1388,5.9392a3.43784,3.43784,0,0,1,2.921,3.01207l3.6276,31.97552a2.706,2.706,0,0,0,.10824.50822L696.7908,754.59006a3.44866,3.44866,0,0,1-2.187,4.29679l-10.65907,3.55309a3.45166,3.45166,0,0,1-4.15743-1.72215L626.43425,660.11588a1.14475,1.14475,0,0,0-2.14187.26678L599.90349,765.46244A3.41988,3.41988,0,0,1,596.56111,768.16153Z"
                transform="translate(-160.6669 -108.65425)" fill="#2f2e41" />
            <path
                d="M564.04807,534.50479a8.03219,8.03219,0,0,1,.1826,1.25155l32.77991,18.9106,7.96762-4.58682,8.494,11.1198-13.316,9.49082a6.10465,6.10465,0,0,1-7.32418-.17844l-33.80172-26.66641a8.01011,8.01011,0,1,1,5.0178-9.3411Z"
                transform="translate(-160.6669 -108.65425)" fill="#ffb8b8" />
            <path
                d="M597.461,552.77669a3.43015,3.43015,0,0,1,1.68736-2.30834l15.04254-8.41125a9.53651,9.53651,0,0,1,11.69543,15.06633l-11.99356,12.45436a3.43386,3.43386,0,0,1-5.19192-.28438l-10.59439-13.7308A3.43,3.43,0,0,1,597.461,552.77669Z"
                transform="translate(-160.6669 -108.65425)" fill="#f9a826" />
            <circle cx="471.82366" cy="405.22341" r="18.74199" fill="#ffb8b8" />
            <path
                d="M650.74061,604.9149a3.433,3.433,0,0,1-.55554-.04546l-40.56016-6.64936a3.43375,3.43375,0,0,1-2.8036-4.1008l1.97327-9.303c-1.01011-1.50678-9.23518-14.60953.78264-26.91715a16.79567,16.79567,0,0,1,15.59225-17.49119l20.96119-1.59248A16.88468,16.88468,0,0,1,663.698,560.09373l-9.60946,42.1504A3.44171,3.44171,0,0,1,650.74061,604.9149Z"
                transform="translate(-160.6669 -108.65425)" fill="#f9a826" />
            <path
                d="M688.61682,640.16153a8.19751,8.19751,0,0,0-3.2585-12.14021l-23.09343-71.002-13.38316,6.35033,25.26794,69.13388a8.24194,8.24194,0,0,0,14.46715,7.65805Z"
                transform="translate(-160.6669 -108.65425)" fill="#ffb8b8" />
            <path
                d="M667.37295,568.84032l-17.77089,5.36829a3.67567,3.67567,0,0,1-4.69922-2.98259l-2.69786-18.3101a10.208,10.208,0,0,1,19.56085-5.8465l7.86912,16.68546a3.67565,3.67565,0,0,1-2.262,5.08544Z"
                transform="translate(-160.6669 -108.65425)" fill="#f9a826" />
            <path
                d="M614.27251,514.60153a23.23077,23.23077,0,0,0,24.57932-5.16171c-1.96587,5.19382-1.41628,27.222-1.41628,27.222s17.43381-8.27686,19.799-9.72436c13.96978-8.54965-5.29721-45.74111-21.32521-39.87574-2.71474.99344-4.98212,2.16235-6.08026,4.8363-2.39326-2.95216-6.92358-3.59246-10.40836-2.07612s-5.962,4.80238-7.294,8.3617a20.91346,20.91346,0,0,0,1.52082,17.63735Z"
                transform="translate(-160.6669 -108.65425)" />
            <ellipse cx="701.23709" cy="223" rx="177.42911" ry="223" fill="#f2f2f2" />
            <path
                d="M993.88685,182.70776c38.52218,113.25414-3.29823,244.31383-93.40842,292.73005-70.107,37.66847-151.523,14.83739-202.24091-56.71338,38.518,113.25747,142.79392,165.82594,232.90683,117.41493,90.11283-48.411,131.93874-179.46914,93.42074-292.72659A236.76464,236.76464,0,0,0,993.88685,182.70776Z"
                transform="translate(-160.6669 -108.65425)" fill="#e6e6e6" />
            <polygon points="701.725 177.429 702.212 177.429 710.986 680.469 692.464 680.469 701.725 177.429"
                fill="#ccc" />
            <rect x="861.41656" y="623.53872" width="33.14612" height="8.77394"
                transform="translate(-352.0992 372.66587) rotate(-27.76587)" fill="#ccc" />
            <ellipse cx="137.0136" cy="326.5" rx="137.0136" ry="171.5" fill="#f2f2f2" />
            <path
                d="M399.59979,320.60571c29.74744,87.099-2.54695,187.89158-72.13149,225.12648C273.33058,574.70144,210.45984,557.143,171.29462,502.1163c29.74423,87.10159,110.26777,127.52981,179.8544,90.29892C420.7356,555.18436,453.03424,454.393,423.29,367.2914A181.80279,181.80279,0,0,0,399.59979,320.60571Z"
                transform="translate(-160.6669 -108.65425)" fill="#e6e6e6" />
            <polygon points="137.39 292.014 137.766 292.014 144.542 680.469 130.239 680.469 137.39 292.014"
                fill="#ccc" />
            <rect x="297.3041" y="666.83447" width="25.59597" height="6.77538"
                transform="translate(-437.19076 112.98008) rotate(-27.76587)" fill="#ccc" />
            <path d="M962.91364,789.65425h-780a1,1,0,0,1,0-2h780a1,1,0,0,1,0,2Z"
                transform="translate(-160.6669 -108.65425)" fill="#ccc" />
            <path
                d="M589.87382,282.25721a18.33047,18.33047,0,1,0-21.1946,18.10868v-12.8084h-4.65545v-5.30028h4.65545V278.218c0-4.59326,2.7373-7.13252,6.92384-7.13252a28.17087,28.17087,0,0,1,4.10389.35843v4.51142h-2.31258a2.65048,2.65048,0,0,0-2.9877,2.86412v3.4386h5.08343l-.81179,5.30027h-4.27165v12.80924a18.33536,18.33536,0,0,0,15.46714-18.11035Z"
                transform="translate(-160.6669 -108.65425)" fill="#3f3d56" fill-rule="evenodd" />
            <path
                d="M505.10722,336.71233l3.33813-.66763a31.30314,31.30314,0,0,1-3.33813,3.33813h0a13.43338,13.43338,0,0,0,0,2.00288c-6.40921,27.50618-30.04316,15.35539-30.04316,15.35539,8.61237.20028,9.34676-3.33813,9.34676-3.33813-5.00719-.73439-6.00863-4.00576-6.00863-4.00576a2.063,2.063,0,0,0,2.6705-.66762,6.06412,6.06412,0,0,1-4.67338-6.67626,6.94357,6.94357,0,0,0,3.27136,1.26849c-.60086-.7344-5.67481-6.80979-2.60373-9.94762,0,0,3.73871,6.67625,13.55279,7.27711l.66763-.13353a5.24112,5.24112,0,0,1-.13354-1.46879,7.01009,7.01009,0,0,1,7.01007-7.01007h0c4.67338,0,5.67482,2.67051,5.67482,2.67051l3.33813-2.00288C507.11009,332.70657,506.77628,336.0447,505.10722,336.71233Z"
                transform="translate(-160.6669 -108.65425)" fill="#3f3d56" />
            <path
                d="M587.407,381.23211H573.3102a9.89717,9.89717,0,0,0-9.86834,9.86832v14.09676a9.89718,9.89718,0,0,0,9.86834,9.86833H587.407a9.89719,9.89719,0,0,0,9.8683-9.86833V391.10043A9.89718,9.89718,0,0,0,587.407,381.23211Z"
                transform="translate(-160.6669 -108.65425)" fill="#3f3d56" />
            <path d="M589.52152,391.10043a2.11007,2.11007,0,1,1,.00909,0Z" transform="translate(-160.6669 -108.65425)"
                fill="#fff" />
            <path
                d="M580.35858,392.50964a5.63915,5.63915,0,1,1-5.63917,5.63914,5.63914,5.63914,0,0,1,5.63917-5.63914h0m0-2.8192a8.45835,8.45835,0,1,0,8.45831,8.45837v0a8.45836,8.45836,0,0,0-8.45831-8.45834Z"
                transform="translate(-160.6669 -108.65425)" fill="#fff" />
            <path
                d="M533.17528,464.7249a18.389,18.389,0,0,0-7.37962,35.2317,16.28379,16.28379,0,0,1,.32012-4.21928c.353-1.494,2.36412-10.02282,2.36412-10.02282a7.02041,7.02041,0,0,1-.591-2.90587c0-2.72525,1.57607-4.761,3.54615-4.761a2.45961,2.45961,0,0,1,2.479,2.75811c0,1.68278-1.07535,4.19465-1.62534,6.52592a2.84279,2.84279,0,0,0,2.90587,3.53794c3.4805,0,5.82816-4.47375,5.82816-9.77656,0-4.03045-2.71708-7.043-7.65052-7.043a8.7127,8.7127,0,0,0-9.05419,8.80792,5.30023,5.30023,0,0,0,1.21488,3.60362.89873.89873,0,0,1,.26267,1.02609c-.0903.33657-.28732,1.14922-.37762,1.47757a.63177.63177,0,0,1-.91937.45969c-2.56932-1.05071-3.76778-3.85809-3.76778-7.02664,0-5.22073,4.40807-11.484,13.14213-11.484,7.01842,0,11.63993,5.08117,11.63993,10.53175,0,7.21544-4.01407,12.60033-9.92429,12.60033a5.27637,5.27637,0,0,1-4.49013-2.29021s-1.06713,4.23567-1.297,5.05656a15.28345,15.28345,0,0,1-1.847,3.94017,18.3906,18.3906,0,1,0,5.22072-36.02793Z"
                transform="translate(-160.6669 -108.65425)" fill="#3f3d56" />
            <path
                d="M571.5434,315.14865a33,33,0,1,1,32.99988-33A33.03734,33.03734,0,0,1,571.5434,315.14865Zm0-64a31,31,0,1,0,30.99988,31A31.0352,31.0352,0,0,0,571.5434,251.14865Z"
                transform="translate(-160.6669 -108.65425)" fill="#3f3d56" />
            <path
                d="M491.7547,378.72677a33,33,0,1,1,33-33A33.03734,33.03734,0,0,1,491.7547,378.72677Zm0-64a31,31,0,1,0,31,31A31.03521,31.03521,0,0,0,491.7547,314.72677Z"
                transform="translate(-160.6669 -108.65425)" fill="#3f3d56" />
            <path
                d="M580.35846,431.14865a33,33,0,1,1,33-33A33.03734,33.03734,0,0,1,580.35846,431.14865Zm0-64a31,31,0,1,0,31,31A31.03521,31.03521,0,0,0,580.35846,367.14865Z"
                transform="translate(-160.6669 -108.65425)" fill="#3f3d56" />
            <path
                d="M533.17365,516.11789a33,33,0,1,1,33-33A33.03734,33.03734,0,0,1,533.17365,516.11789Zm0-64a31,31,0,1,0,31,31A31.0352,31.0352,0,0,0,533.17365,452.11789Z"
                transform="translate(-160.6669 -108.65425)" fill="#3f3d56" />
        </svg>
    </div>
    <div class="content">
        <div class="input">
            <div class="info-text">
                Make Simple and Slick profile pic !
            </div>
            <div class="input-bar">
                <input type="text" placeholder="Enter your Name" id="name" autocomplete="off">
                <button id="btn">Make</button>
            </div>
            <div class="error">
                <div id="errorText"></div>
            </div>
        </div>
        <div class="profile" id="download">
            <div id="dowloadBtn">
                <svg width="80" height="80" viewBox="0 0 80 80" fill="none" xmlns="http://www.w3.org/2000/svg">
                    <path
                        d="M76.7188 46.7188H70L60.9375 53.2812H73.2812V73.2812H6.71875V53.2812H19.0625L10 46.7188H3.28125C2.44792 46.7188 1.69271 47.0573 1.01562 47.7344C0.338542 48.4115 0 49.1667 0 50V73.2812C0 75.1562 0.651042 76.7448 1.95312 78.0469C3.25521 79.349 4.84375 80 6.71875 80H73.2812C75.1562 80 76.7448 79.349 78.0469 78.0469C79.349 76.7448 80 75.1562 80 73.2812V50C80 49.1667 79.6615 48.4115 78.9844 47.7344C78.3073 47.0573 77.5521 46.7188 76.7188 46.7188ZM40 0C37.8125 0 36.7188 1.09375 36.7188 3.28125V49.6875L22.0312 37.6562C21.3021 37.0312 20.4688 36.7708 19.5312 36.875C18.5938 36.9792 17.8646 37.3438 17.3438 37.9688C16.7188 38.6979 16.4583 39.5312 16.5625 40.4688C16.6667 41.4062 17.0312 42.1354 17.6562 42.6562L40 60L62.0312 42.6562C63.5938 41.0938 63.6979 39.5312 62.3438 37.9688C60.6771 36.5104 59.1146 36.4062 57.6562 37.6562L43.2812 49.6875V3.28125C43.2812 1.09375 42.1875 0 40 0ZM66.7188 63.2812C66.7188 64.2188 66.3802 65.026 65.7031 65.7031C65.026 66.3802 64.2188 66.7188 63.2812 66.7188C62.4479 66.7188 61.6927 66.3802 61.0156 65.7031C60.3385 65.026 60 64.2188 60 63.2812C60 62.4479 60.3385 61.6927 61.0156 61.0156C61.6927 60.3385 62.4479 60 63.2812 60C64.2188 60 65.026 60.3385 65.7031 61.0156C66.3802 61.6927 66.7188 62.4479 66.7188 63.2812ZM56.7188 63.2812C56.7188 64.2188 56.3802 65.026 55.7031 65.7031C55.026 66.3802 54.2188 66.7188 53.2812 66.7188C52.4479 66.7188 51.6927 66.3802 51.0156 65.7031C50.3385 65.026 50 64.2188 50 63.2812C50 62.4479 50.3385 61.6927 51.0156 61.0156C51.6927 60.3385 52.4479 60 53.2812 60C54.2188 60 55.026 60.3385 55.7031 61.0156C56.3802 61.6927 56.7188 62.4479 56.7188 63.2812Z"
                        fill="white" />
                </svg>

            </div>
            <div id="profilePic">
                <div id="text">GS</div>
            </div>
        </div>

    </div>

    <footer>
        Made with ❤ and ☕ by <a href="https://jhamadhav.com">Madhav</a> for <a
            href="https://www.girlscript.tech/Home">Girlscript !</a>
    </footer>

    <!-- scripts -->
    <script src="../assets/js/avatarMaker_js/avatarMaker.js"></script>
    <script src="../assets/js/avatarMaker_js/html2canvas.js"></script>
</body>

</html>